<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>Document</title>

</head>

<body>

  <div class="outside-box">

    <div class="inside-box">

      <p>盒子模型</p>

    </div>

  </div>

</body>



<style>

  .outside-box {

    width: 300px;

    height: 200px;

    background-color: lightgreen;

    padding: 20px;

    border: 10px solid green;

    margin: 30px;

  }



  .inside-box {

    width: 200px;

    height: 100px;

    background-color: lightblue;

    padding: 20px;

    border: 10px solid greenyellow;

    margin: 30px;

  }

</style>



</html>